<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>修改表单属性</title>
	</head>
	<body>
		<button id="change">点击我改变输入框中的值</button>
		<button id="dis">点击我按钮被禁用</button>
		<input type="text" value="请输入用户名">
		<input type="password">
		<button id="show-pasword">点击我显示密码和隐藏密码</button>
		<script>
			var btn1 = document.querySelector('#change');
			var username = document.querySelector('input[type=text]');
			btn1.onclick = function(){
				// username.innerHTML = '我被点击了';
				username.value='我被点击了';
			}
			var btn2 = document.querySelector('#dis');
			btn2.onclick = function(){
				// btn2.disabled = true;
				this.disabled = true;
			}
			
			var f = 0; //当f等于0的时候以为着是密码框，其它值以为着是文本框
			var password = document.querySelector('input[type=password]');
			var btn3 = document.querySelector('#show-pasword');
			btn3.onclick = function(){
				if(f==0){
					password.type = 'text';
					f = 1;
				}else {
					password.type = 'password';
					f = 0;
				}
			};
			
			
			
			
		</script>
	</body>
</html>